<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@page import="java.security.interfaces.RSAPrivateKey"%>
<%@page import="java.util.HashMap"%>
<%@page import="util.RSAUtil"%>
<%@page import="java.security.interfaces.RSAPublicKey"%>
<%@page import="java.util.Map"%>
<%@page import="java.security.Key"%>

<%
	Map<String, Key> keyMap = RSAUtil.initKey();
	//公钥信息保存在页面，用于加密
	String publicKey = RSAUtil.getPublicKey(keyMap);
	String privateKey = RSAUtil.getPrivateKey(keyMap);
	System.out.println("公钥:" + publicKey);
	System.out.println("私钥" + privateKey);
	session.setAttribute("privateKey", privateKey);//私钥保存在session中，用于解密
%>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>主页</title>
<!--Core CSS -->
<link
	href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"
	rel="stylesheet">
<link rel="stylesheet" href="css/animate.css">
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet">
<link href="css/style-responsive.css" rel="stylesheet">
<link href="css/toastr.min.css" rel="stylesheet">
<link href="css/toastr.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    
    <style type="text/css">
@import
	url(http://fonts.googleapis.com/css?family=Raleway:300,400,600,700,800,900 

);

/* Reset
=====================================================================*/
* {
	padding: 0;
	margin: 0;
}

body {
	background: #ffffff;
	font-family: 'Raleway', sans-serif;
	overflow-x: hidden;
	text-rendering: optimizelegibility;
}

a {
	color: #ffffff;
	text-decoration: none;
}

a:hover {
	color: #ffffff;
	text-decoration: none;
}

a:focus {
	color: #ffffff;
	outline: medium none;
	outline-offset: 0;
}

/* Headings */
h1 {
	font-size: 2em;
	font-weight: normal;
	line-height: 1.15;
}

h2 {
	font-size: 1.5em;
	line-height: 1.25;
	margin-bottom: .45em;
}

h3 {
	font-size: 1.35em;
	line-height: 1.25;
	margin-bottom: .45em;
}

h4 {
	font-size: 1.05em;
	line-height: 1.35;
	margin-bottom: .45em;
}

h5 {
	font-size: 1.05em;
	line-height: 1.35;
	margin-bottom: .45em;
}

h6 {
	font-size: 1em;
	line-height: 1.35;
	margin-bottom: 1em;
}

/* Forms */
form {
	display: inline;
}

fieldset {
	border: 0;
}

legend {
	display: none;
}

/* Table */
table {
	border: 0; /*border-collapse:collapse;*/
	border-spacing: 0;
	empty-cells: show;
	font-size: 100%;
}

caption, th, td {
	vertical-align: top;
	text-align: left;
	font-weight: normal;
}

/* Content */
p {
	margin: 0 0 1em;
}

strong {
	font-weight: bold;
}

address {
	font-style: normal;
	line-height: 1.35;
}

cite {
	font-style: normal;
}

q, blockquote {
	quotes: none;
}

q:before, q:after {
	content: '';
}

small {
	font-size: 1em;
}

big {
	font-size: 1.15em;
}
/*sup           { font-size:1em; vertical-align:top; }*/

/* Lists */
ul, ol {
	list-style: none;
}

.copyrights {
	text-indent: -9999px;
	height: 0;
	line-height: 0;
	font-size: 0;
	overflow: hidden;
}
/* Show Messages
=====================================================================*/
.gen {
	background: none repeat scroll 0 0 #fff;
	color: #008900;
	font-size: 20px;
	margin: 15px auto;
	padding: 5px;
	text-align: center;
}

.err {
	background: none repeat scroll 0 0 #FF0000;
	color: #008900;
	font-size: 20px;
	margin: 15px auto;
	padding: 5px;
	text-align: center;
}

/* Section Title
=====================================================================*/
.section-title {
	margin-bottom: 35px;
	margin-top: 80px;
	text-align: center;
}

.section-title h2 {
	font-size: 26px;
	font-weight: 800;
	letter-spacing: 0.04em;
	margin: 0 0 10px;
	padding: 0 0 15px;
	position: relative;
	text-align: center;
	text-transform: uppercase;
}

.section-title h2:before {
	border: 2px solid #59a3fc;
	bottom: 0;
	content: "";
	left: 0;
	margin: 0 auto;
	position: absolute;
	right: 0;
	width: 100px;
}

.section-title p {
	color: #9c9c9c;
	font-size: 16px;
	font-style: italic;
	text-align: center;
}

/* Site Header Part
=====================================================================*/
.overlay {
	background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
	height: 100%;
	width: 100%;
}

.site_logo {
	margin-top: 50px;
	text-align: center;
}

.menu_area {
	background: url("images/menu_bg.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
	bottom: 0;
	height: 50px;
	position: absolute;
	width: 100%;
}

.stick_menu {
	position: fixed;
	top: 0;
	z-index: 9999;
}

.header_part {
	background: url("images/background.jpg") repeat scroll center center/cover
		rgba(0, 0, 0, 0);
	overflow: hidden;
}

.navbar-default {
	background-color: transparent;
	border-color: transparent;
}

.logo {
	
}

.active {
	background: url("images/active-bg.png") repeat scroll 0 0
		rgba(0, 0, 0, 0) !important;
	color: #fff !important;
}

.logo a {
	color: #ffffff !important;
}

.navbar-default .navbar-nav>li>a, .navbar-default .navbar-nav>li>a:hover,
	.navbar-default .navbar-nav>li>a:focus {
	color: #fff;
}

.site_title {
	
}

.site_title h1 {
	color: #fff;
	font-size: 50px;
	font-weight: 700;
	margin: 30px auto;
	text-align: center;
}

.site_title p {
	color: #fff;
	font-size: 18px;
	text-align: center;
}

/* Site Countdown Part
=====================================================================*/
.countdown {
	color: #fff;
	margin: 40px auto 10px;
	width: 70%;
}

.countdown_row {
	display: block;
	margin-left: 5px;
	overflow: hidden;
	width: 100%;
}

.countdown_section {
	background: none repeat scroll 0 0 transparent;
	border: 2px solid #ddd;
	border-radius: 100%;
	display: block;
	float: left;
	font-size: 25px;
	margin: 15px 30px auto;
	padding: 30px 12px;
	text-align: center;
	width: 140px;
}

.countdown_amount {
	font-size: 25px;
	font-weight: 800;
}

/* About Section
=====================================================================*/
.welcome_section {
	overflow: hidden;
}

.about {
	margin: 0 auto;
	padding: 60px 20px;
}

.about h2 {
	font-size: 35px;
	font-weight: bold;
	text-align: center;
}

.about p {
	margin: 20px;
	text-align: center;
}

.welcome_part {
	margin: 50px auto 80px;
}

.welcome_icon {
	background: none repeat scroll 0 0 transparent;
	border: 2px solid #59a3fc;
	border-radius: 100%;
	color: #59a3fc;
	margin: 0 auto;
	padding: 35px;
	text-align: center;
	width: 140px;
}

.welcome_part h2 {
	font-size: 16px;
	font-weight: 700;
	margin-bottom: 5px;
	text-transform: uppercase;
	text-align: center;
}

.welcome_part p {
	color: #9c9c9c;
	font-size: 14px;
	text-align: center;
}

/* Email Subscribe Section
=====================================================================*/
.email_subscribe_section {
	background: none repeat scroll 0 0 #ecf0f1;
	color: #000;
	height: auto;
	overflow: hidden;
	width: 100%;
}

.email_subscriber_head {
	margin: 100px auto 30px;
}

.email_subscriber_head h2 {
	font-size: 35px;
	text-align: center;
}

.email_subscriber_head p {
	text-align: center;
}

.email_subscribe_form_part {
	margin-bottom: 80px;
	text-align: center;
}

.email_input_box {
	background: none repeat scroll 0 0 #fff;
	border-radius: 30px;
	color: #000;
	display: inline;
	font-size: 15px;
	height: auto;
	margin: 20px 30px;
	padding: 15px;
	width: 40%;
}

.email_submit_box {
	border-radius: 30px;
	margin-top: -5px;
	padding: 15px 40px;
}

.email_submit_box:focus, .email_submit_box:active:focus,
	.email_submit_box.active:focus {
	outline: medium none;
	outline-offset: -2px;
}

/* Contact Section
=====================================================================*/
.contact_section {
	overflow: hidden;
	background: none repeat scroll 0 0 #18191a;
	color: #fff;
}

.contact_head {
	padding: 80px 0 30px;
	text-align: center;
}

.contact_head h2 {
	font-size: 35px;
	font-weight: bold;
}

.contact_head p {
	
}

.address_part {
	
}

.address {
	margin: 10px auto;
	font-weight: 600;
}

.phone {
	margin: 10px auto;
	font-weight: 600;
}

.email {
	margin: 10px auto;
	font-weight: 600;
}

.social_icons {
	
}

.social_icons ul {
	
}

.social_icons ul li {
	display: inline;
	font-size: 20px;
	margin-right: 10px;
}

.social_icons ul li a {
	font-size: 40px;
}

.contact_form {
	margin-bottom: 60px;
}

.contact_input_box {
	background: none repeat scroll 0 0 transparent;
	border: 1px solid #666;
	border-radius: 30px;
	color: #fff;
	height: auto;
	margin-bottom: 30px;
	padding: 15px;
	resize: none;
}

.contact_button {
	border-radius: 30px;
	font-size: 18px;
	height: auto;
	padding: 10px 25px;
}

.contact_button:focus, .contact_button:active:focus, .contact_button.active:focus
	{
	outline: medium none;
	outline-offset: -2px;
}
</style>
</head>
<body>
	<!-- Header Section Start -->
	<header id="header_part">
		<div class="header_part" id="head">
			<div class="overlay">
				<div class="start_part">
					<div class="container">
						<div class="row">
							<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
								<div class="row">
									<!-- Logo Start -->
									<div class="site_logo">
										<a href="#" title=""><img src="images/logo.png" alt=""
											title="" /></a>
									</div>
									<!-- Logo End-->
									<!-- Site Title start-->
									<div class="site_title">
										<h1>交通执法，与您同在</h1>
										<p>天网恢恢疏而不漏，正义永远不会缺席，缉查布控系统，助您一臂之力！</p>

									</div>
								</div>
							</div>
						</div>
						<!-- Menu Start -->
						<div class="menu_area" id="stick_menu">
							<div class="container">
								<div class="row">
									<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
										<nav class="navbar navbar-default" role="navigation">
											<div class="container-fluid">
												<div class="collapse navbar-collapse mainnavmenu"
													id="bs-example-navbar-collapse-1">
													<div id="menu-center">
														<ul class="nav navbar-nav navbar-right mainnav">
															<li><a href="#header_part">开始</a></li>
															<li><a href="#contact_section">注册</a></li>
														</ul>
													</div>
												</div>
											</div>
										</nav>
									</div>
								</div>
							</div>
						</div>
						<!-- Menu End-->
					</div>
				</div>
	</header>
	<!-- Header Section End -->

	<!-- Contact Section Start -->
	<section id="contact_section">
		<div class="contact_section">
			<div class="container">
				<div class="row">
					<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
						<div class="row">
							<div class="section-title">
								<h2>注册</h2>
								<p>快来注册成为系统的主人，开始便利的工作吧！</p>
							</div>
						</div>
						<div class="row">
							<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
								<div class="address_part">
									<div class="address">
										<i class="fa fa-map-marker"></i> 上园村3号 <br /> 北京交通大学 <br />
										软件学院 <br /> AVG18第九小组
									</div>
									<div class="phone">
										<i class="fa fa-phone"></i> +86 181 429 32 777
									</div>
									<div class="email">
										<i class="fa fa-envelope-o"></i> 15301111@bjtu.edu.cn
									</div>
									<div class="social_icons">
										<ul>
											<li><a href="#" data-toggle="tooltip"
												data-placement="top" title="Facebook" data-rel="tooltip"
												class="icon_fb"><i class="fa fa-facebook-square"></i></a></li>
											<li><a href="#" data-toggle="tooltip"
												data-placement="top" title="Twitter" data-rel="tooltip"
												class="icon_twitter"><i class="fa fa-twitter-square"></i></a></li>
											<li><a href="#" data-toggle="tooltip"
												data-placement="top" title="Google+" data-rel="tooltip"
												class="icon_gplus"><i class="fa fa-google-plus-square"></i></a></li>
											<li><a href="#" data-toggle="tooltip"
												data-placement="top" title="Linkdin" data-rel="tooltip"
												class="icon_linkdin"><i class="fa fa-linkedin-square"></i></a></li>
											<li><a href="#" data-toggle="tooltip"
												data-placement="top" title="Youtube" data-rel="tooltip"
												class="icon_youtube"><i
													class="fa fa-circle fa-youtube-square"></i></a></li>
											<li><a href="#" data-toggle="tooltip"
												data-placement="top" title="Vimeo" data-rel="tooltip"
												class="icon_vimeo"><i class="fa fa-vimeo-square"></i></a></li>
										</ul>

									</div>
								</div>
							</div>
							<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
								<div class="contact_form">
									<div id="show_contact_msg"></div>
									<!-- Contact Form Start -->
									<form action="还没写" method="post" name="form" id="contact_form"
										onSubmit="return check_login()">

										<input type="text" id="name" name="name"
											class="form-control contact_input_box wow fadeInUp"
											placeholder="用户名" required /> <input type="password"
											id="password" name="password"
											class="form-control contact_input_box wow fadeInUp"
											placeholder="密码" required /> <input type="password"
											id="rpassword" name="rpassword"
											class="form-control contact_input_box wow fadeInUp"
											placeholder="再次确认密码" required />
										
										<button type="button"
												class="btn btn-primary contact_button wow fadeInUp"
												onclick="check_register()">
												<i class="fa fa-send-o"></i> 注册
											</button>

									</form>
									<!-- Contact Form End -->
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- Contact Section End -->
	<!--Core js-->
	<script src="js/jquery.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script src="js/toastr.min.js"></script>
	<script src="js/jquery.smooth-scroll.js"></script>
	<script src="js/jsencrypt.min.js"></script>
	<script src="js/wow.min.js"></script>
	<script src="js/jquery.nicescroll.min.js"></script>
	<script src="js/jquery.countdown.min.js"></script>
	<!--common script init for all pages-->
	<script src="js/script.js"></script>
	<script src="js/layer.js"></script>
	<script>
		// 验证输入不为空的脚本代码
		
		function check_register() {
			if (form.name.value == "") {
				alert("用户名不能为空!");
				form.username.focus();
				return false;
			}
			if (form.password.value == "") {
				alert("密码不能为空!");
				form.password.focus();
				return false;
			}
			if (form.password.value != form.rpassword.value) {
				toastr.options = {

					closeButton : true,
					debug : false,
					progressBar : false,
					positionClass : "toast-top-full-width",
					onclick : null,
					showDuration : "100",
					hideDuration : "100",
					timeOut : "1000",
					extendedTimeOut : "100",
					showEasing : "swing",
					hideEasing : "linear",
					showMethod : "fadeIn",
					hideMethod : "fadeOut"
				};

				var $toast = toastr['error']('两次输入的密码应该相同', '错误');
				return false;
			}
			if (form.password.value.length < 6) {
				toastr.options = {

					closeButton : true,
					debug : false,
					progressBar : false,
					positionClass : "toast-top-full-width",
					onclick : null,
					showDuration : "100",
					hideDuration : "100",
					timeOut : "1000",
					extendedTimeOut : "100",
					showEasing : "swing",
					hideEasing : "linear",
					showMethod : "fadeIn",
					hideMethod : "fadeOut"
				};

				var $toast = toastr['error']('密码长度不能能少于6位', '错误');
				return false;

			}
			var name = document.getElementById("name");
			var password = $("#password");
			var encrypt = new JSEncrypt();
			encrypt.setPublicKey("<%=publicKey%>");
			var enpassword = encrypt.encrypt(password.val());
			var index = layer.load(1, {
				  shade: [0.1,'#fff'] //0.1透明度的白色背景
				});
			$.ajax({
				url : "register",
				type : "post",
				data : {
					username : name.value,
					password : enpassword
				},
				success:function onSuccess(data){
					if(data.result == true){
						location.href="toLogin"
					}else{
						toastr.options = {

								closeButton : true,
								debug : false,
								progressBar : false,
								positionClass : "toast-top-full-width",
								onclick : null,
								showDuration : "100",
								hideDuration : "100",
								timeOut : "1000",
								extendedTimeOut : "100",
								showEasing : "swing",
								hideEasing : "linear",
								showMethod : "fadeIn",
								hideMethod : "fadeOut"
							};

							var $toast = toastr['error']('注册失败', '错误');
					}
				}
			});
		}
	</script>
</body>
</html>